<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>发布房源信息</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/house/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/house/layuiadmin/style/admin.css" media="all">
    <link href="/house/static/layui/css/layui.css" rel="stylesheet">
    <script src="/house/static/layui/layui.js"></script>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">发布房源信息</div>
                <div class="layui-card-body" pad15>
                    <div class="layui-form" lay-filter="userInfo">
                        <input type="hidden" name="id">
                        <div class="layui-form-item">
                            <label class="layui-form-label">发布人</label>
                            <div class="layui-input-inline">
                                <input type="text" name="username" value="" readonly class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">价格</label>
                            <div class="layui-input-inline">
                                <input type="text" name="price" value="" lay-verify="price" autocomplete="off"
                                       placeholder="请输入价格" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">介绍</label>
                            <div class="layui-input-inline">
                                <input type="text" name="introduce" value="" lay-verify="introduce" autocomplete="off"
                                       placeholder="介绍" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">特点</label>
                            <div class="layui-input-inline">
                                <input type="text" name="characteristic" value="" lay-verify="characteristic" autocomplete="off"
                                       placeholder="特点" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">小区名称</label>
                            <div class="layui-input-inline">
                                <input type="text" name="communityName" value="" lay-verify="communityName" autocomplete="off"
                                       placeholder="小区名称" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">小区地址</label>
                            <div class="layui-input-inline">
                                <input type="text" name="communityAddress" value="" lay-verify="communityAddress" autocomplete="off"
                                       placeholder="小区地址" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">格局</label>
                            <div class="layui-input-inline">
                                <input type="text" name="pattern" value="" lay-verify="pattern" autocomplete="off"
                                       placeholder="格局" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">大小</label>
                            <div class="layui-input-inline">
                                <input type="text" name="size" value="" lay-verify="size" autocomplete="off"
                                       placeholder="大小" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">朝向</label>
                            <div class="layui-input-inline">
                                <input type="text" name="orientation" value="" lay-verify="orientation" autocomplete="off"
                                       placeholder="朝向" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">床</label>
                            <div class="layui-input-inline">
                                <select name="bed" lay-filter="bed">
                                    <option value="">有/无</option>
                                    <option value="1">有</option>
                                    <option value="0">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">空调</label>
                            <div class="layui-input-inline">
                                <select name="airConditioner" lay-filter="airConditioner">
                                    <option value="">有/无</option>
                                    <option value="1">有</option>
                                    <option value="0">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">衣柜</label>
                            <div class="layui-input-inline">
                                <select name="wardrobe" lay-filter="wardrobe">
                                    <option value="">有/无</option>
                                    <option value="1">有</option>
                                    <option value="0">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">洗衣机</label>
                            <div class="layui-input-inline">
                                <select name="washingMachine" lay-filter="washingMachine">
                                    <option value="">有/无</option>
                                    <option value="1">有</option>
                                    <option value="0">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">沙发</label>
                            <div class="layui-input-inline">
                                <select name="sofa" lay-filter="sofa">
                                    <option value="">有/无</option>
                                    <option value="1">有</option>
                                    <option value="0">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">冰箱</label>
                            <div class="layui-input-inline">
                                <select name="refrigerator" lay-filter="refrigerator">
                                    <option value="">有/无</option>
                                    <option value="1">有</option>
                                    <option value="0">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-input-wrap">
                                <button type="button" class="layui-btn" id="ID-upload-demo-btn">
                                    <i class="layui-icon layui-icon-upload"></i>图片上传
                                </button>
                                <div style="width: 132px;">
                                    <div class="layui-upload-list">
                                        <img class="layui-upload-img" id="ID-upload-demo-img" style="width: 100%; height: 92px;">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-input-block">
                                <button class="layui-btn" lay-submit lay-filter="publishHouse">发布</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>

    layui.use(function () {
        let form = layui.form;
        let $ = layui.$;
        let layer = layui.layer;
        let upload = layui.upload;
        let fileName;

        //  1.获取用户的基本信息，回显用户基本资料

        //通过登录之后返回的用户信息，但是有弊端，如果管理员在用户登录之后将数据库中的用户信息修改，此时数据的回显就与数据库中的数据不一致。
        // let userinfo = JSON.parse(sessionStorage.getItem("userInfo"));
        // form.val('userInfo',userinfo);
        // form.render();

        //优化：发送异步请求，获取用户的基本信息，回显用户基本资料
        let username = sessionStorage.getItem("username");
        $.ajax({
            url:'/house/user/personalInfo',
            data:{username},    //{username:username}
            dataType:'JSON',
            type:'GET',
            success:function (res){
                if (res.code===0){
                    let user = res.data;
                    console.log(user);
                    form.val('userInfo',user);
                    form.render();
                }
            }
        })

        // 渲染
        upload.render({
            elem: '#ID-upload-demo-btn',
            url: '/house/resource/upload', // 此处配置你自己的上传接口即可
            accept: 'file', // 普通文件
            before: function(obj){
                // 预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#ID-upload-demo-img').attr('src', result); // 图片链接（base64）
                });
            },
            done: function (res) {
                fileName = res.data;
            }
        });

        //监听表单事件 提交修改
        form.on('submit(publishHouse)', function (obj) {
            let formData = obj.field;
            formData.img = fileName;

            // 发送异步请求 实现房源信息发布
            $.post('/house/resource/publish',formData,function (res){
                if (res.code===0){
                    layer.msg(res.message,{icon:1})
                }else{
                    layer.msg(res.message,{icon:2})
                }
            })
        })
    })
</script>
</body>
</html>